<template>
    <div class="index clearafter">
        <module-head></module-head>
        <div class="content cbafter">
            <div class="w220 fl">
                <menu-list></menu-list>
            </div>
            <div class="w980 fr">
                <div class="h1_tit">
                    <h1>检验危急值</h1>
                </div>
                <!-- 危急值 -->
                <div class="bs-example-modal-lg" id="edit_danger">
                    <div class="modal-dialog modal-lg">
                        <div class="modal-content">
                            <div class="modal-header"></div>
                            <div class="paientinfo">
                                <table>
                                    <tr>
                                        <td><img :src="headimg"></td>
                                        <td>
                                            <p><span class="name">{{patientinfo.personName}}</span><span>{{patientinfo.sexText}}</span><span class="age">{{patientinfo.personAge}}岁</span><span>|</span><span class="iphone">{{patientinfo.phoneNo}}</span></p>
                                            <p>
                                                <span class="other">申请机构：{{patientinfo.applyOrgName==null?"未填写":patientinfo.applyOrgName}}</span>
                                                <span class="other">申请科室：{{patientinfo.applyDeptName==null?"未填写":patientinfo.applyDeptName}}</span>
                                                <span class="other">申请医生：{{patientinfo.applyDoctorName==null?"未填写":patientinfo.applyDoctorName}}</span>
                                                <span class="other">申请时间：{{patientinfo.applyTime}}</span>
                                            </p>
                                            <p>
                                                <span class="other">项目名称：{{patientinfo.itemName==null?"未填写":patientinfo.itemName}}</span>
                                                <span class="other">报告机构：{{patientinfo.reportOrgName==null?"未填写":patientinfo.reportOrgName}}</span>
                                                <span class="other">报告时间：{{patientinfo.occurTime}}</span>
                                            </p>
                                        </td>
                                        <td>
                                            <button class="default ok" @click="reportDetail">报告详情</button>
                                           <!--  <button class="default ok" v-if="patientinfo.sourceType==4">自测指标</button> -->
                                        </td>
                                    </tr>
                                </table>
                            </div>
                            <div class="modal-body">
                                <div class="twostep">
                                    <div class="twostep_1">
                                        <h4>危急值</h4>
                                        <!-- <p>
                                            <span>{{patientinfo.indexName}}</span>
                                            <span  :class="{'zhibiao2':parseFloat(patientinfo.indexVal)<parseFloat(patientinfo.normalValBottom),'zhibiao':parseFloat(patientinfo.indexVal)<parseFloat(patientinfo.normalValTop)}">{{patientinfo.indexVal}}</span>
                                            <span>{{patientinfo.indexActionName}}</span></p> -->
                                        <p>
                                        <span>{{patientinfo.indexName}}</span>
                                        <span :class="{'zhibiao2':parseFloat(patientinfo.indexVal)<parseFloat(patientinfo.normalValBottom),'zhibiao':parseFloat(patientinfo.indexVal)<parseFloat(patientinfo.normalValTop)}">{{patientinfo.indexVal}} {{patientinfo.indexUnit}}</span><span>措施：{{patientinfo.indexActionName==null?"无":patientinfo.indexActionName}}</span>
                                        <span>症状：{{patientinfo.symptomlNameString==null?"无":patientinfo.symptomlNameString}}</span></p>
                                    </div>
                                     <div class="twostep_2">
                                            <h4>处理意见</h4>
                                             <form class="cbafter" id="search" v-on:submit.prevent="savedangerdeal">
                                            <div class="form-group">
                                                <div class="col-md-9">
                                                    <select class="form-control" v-model="dangervalDealTypeselect" required>
                                                        <option v-for="item in dangervalDealTypelist" value="{{item.key}}">{{item.text}}</option>
                                                    </select>
                                                </div>
                                                <div class="col-md-3">
                                                     <button class="default ok" type="submit">确定</button>
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--模态框查询图表-->
        <div class="modal fade" id="report" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <!-- <button type="button" class="close" @click="closecharts">&times;</button> -->
                        <h4 class="modal-title" id="myModalLabel">图表</h4>
                    </div>
                    <div class="modal-body"  id="main">
                      
                    </div>
                  
                </div>
            </div>
        </div>
    </div>
    <!-- 报告详情 -->
    <div class="modal fade" id="report-check" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">&times;</button>
                    <h4 class="modal-title report-detail-title">检验报告</h4>
                </div>
                <div class="modal-body">

                    <div class="tips">
                       <span class="col-md-3">项目名称:{{patientinfo.itemName ? patientinfo.itemName : '未填写'}}</span>
                       <span>NO:{{patientinfo.sourceId}}</span>
                       <!-- <span>临床诊断:对了你发咖啡色</span> -->
                    </div>
                    <div class="account-msg">
                        <span class="col-md-3">姓名: {{patientinfo.personName}}</span>
                        <span class="col-md-3">性别: {{patientinfo.sexText}}</span>
                        <span class="col-md-3">年龄: {{patientinfo.personAge}}岁</span>
                        <span class="col-md-3">申请机构: {{patientinfo.applyOrgName}}</span>
                        <span class="col-md-3">申请科室: {{patientinfo.applyDeptName}}</span>
                        <span class="col-md-3">申请医生: {{patientinfo.applyDoctorName}}</span>
                        <span class="col-md-3">申请时间: {{patientinfo.applyTime}}</span>
                        <span class="col-md-3">报告时间: {{patientinfo.occurTime}}</span>
                        <span class="col-md-3">报告机构: {{patientinfo.reportOrgName}}</span>
                    </div>
                    <!-- 常规报告 -->
                    <div class="account-list" v-show="reportSort">
                        <div class="tit">
                            <table class="table">
                                <tr>
                                    <th class="col-md-3">项目名称</th>
                                    <th class="col-md-3">检测结果</th>
                                    <th class="col-md-3">参考范围</th>
                                    <th class="col-md-3">单位</th>
                                </tr>
                            </table>
                        </div>
                        <div class="tit-list">
                            <table class="table">
                                <tr v-for="items in reportDetailData.details">
                                    <td class="col-md-3" v-text="items.labName"></td>
                                    <td class="col-md-3">
                                        {{items.result}}
                                        <span class="prompt-flag" v-text="items.resultPrompt"></span>
                                    </td>
                                    <td class="col-md-3" v-text="items.referLower+'~'+items.referUpper"></td>
                                    <td class="col-md-3" v-text="items.resultUnit"></td>
                                </tr>
                            </table>
                        </div>
                    </div>
                    <!-- 微生物报告 -->
                    <div class="account-list" v-show="!reportSort">
                        <div class="tit">
                            <table class="table">
                                <tr>
                                    <th class="col-md-4">项目名称</th>
                                    <th class="col-md-4">结果类型</th>
                                    <th class="col-md-4">培养结果</th>
                                </tr>
                            </table>
                        </div>
                        <div class="tit-list">
                            <table class="table">
                                <tr v-for="items in reportDetailData.plantResults">
                                    <td class="col-md-4" v-text="items.plantType.localText"></td>
                                    <td class="col-md-4" v-text="items.resultType"></td>
                                    <td class="col-md-4" v-text="items.plantResult"></td>
                                </tr>
                                <tr>
                                    <th>乳酸小杆菌&lt;10万</th>
                                </tr>
                                <tr v-for="item in reportDetailData.bioResults">
                                    <td class="col-md-4" v-text="item.bio.localText"></td>
                                    <td class="col-md-4" v-text="item.antiResults[0].antiResult"></td>
                                    <td class="col-md-4"></td>
                                </tr>
                            </table>
                        </div>
                    </div>
                </div>
              
            </div>
        </div>
    </div>
</template>
<script>
import 'assets/lib/bootstrap-3.3.2/css/bootstrap.min.css'
import 'assets/lib/bootstrap-3.3.2/js/bootstrap.min.js'
import 'assets/reset.css'
import Public from 'assets/public.js'
import moduleHead from 'components/module-head'
import menuList from 'components/menu-list'
var headimg = require("assets/img/cs2.jpg");
export default {
    data() {
            return {
                headimg: headimg,
                patientinfo: {
                    personName: "",
                    sexText: "",
                    personAge: "",
                    phoneNO: "",
                    applyOrgName: "",
                    applyDeptName: "",
                    applyDoctorName: "",
                    applyTime: "",
                    itemName: "",
                    reportOrgName: "",
                    occurTime: "",
                    indexName:"",
                    indexVal:"",
                    normalValBottom:"",
                    normalValTop:"",
                    sourceType:"",
                    sourceId: ''
                },
                //报告详情数据
                reportDetailData: [],
                //报告种类
                reportSort: true,
                dangervalDealTypelist: [], //处理类型字典
                dangervalDealTypeselect:""

            }
        },
        computed: {

        },
        components: {
            moduleHead, menuList
        },
        ready() {
            var that = this;
            // 获取字典
            $.when(Public.commonajax("coms.multipleDictionaryService", "findDic", "[['base.dictionary.base_dangervalDealType']]"))
                .done(function(res) {
                    if (res.code == 200) {
                        that.dangervalDealTypelist = res.body[0].items;
                    }
                })

            // 根据dangerRecordId获取信息
            $.when(Public.commonajax("coms.dangerIndexRecordService", "findDangerIndexRecordById", "['" + Public.getParameter("dangerRecordId") + "']"))
                .done(function(res) {
                    if (res.code == 200) {
                        res.body.applyTime = res.body.applyTime != null ? res.body.applyTime.substr(0, 10) : "未填写";
                        res.body.occurTime = res.body.occurTime != null ? res.body.occurTime.substr(0, 10) : "未填写";
                        that.patientinfo = res.body;
                    }

                })
        },
        methods: {
            //报告详情
            reportDetail () {
                $('#report-check').modal('show');//this.patientinfo.sourceId
                // if(this.patientinfo.sourceType == '2'){
                //     this.reportSort = false;
                // }else{
                //     this.reportSort = true;
                // };
                $.when(Public.commonajax('coms.reportService','getLabReport','["'+this.patientinfo.sourceId+'"]')).done(res=>{
                    this.reportDetailData = res.body;
                });
            },

            // 保存危急值处理
            savedangerdeal(){
                $.when(Public.commonajax("coms.dangerIndexRecordService", "dealDangerIndexRecord", "['" +this.patientinfo.dangerRecordId + "','"+this.dangervalDealTypeselect+"']"))
                .done(function(res) {
                    if (res.code == 200) {
                        window.location.replace("index.html")
                    }

                })
            },

        },
        events: {

        },
        watch: {

        }
}
</script>
<style scoped>
.modal-lg {
    width: 950px;
}

.modal-dialog {
    margin-top: 0
}

#edit_danger .modal-body {
    height: 550px;
    padding: 0;
    overflow-y: auto;
    overflow-x: hidden;
}

#edit_danger .modal-header {
    padding: 0;
    border-bottom: 1px solid #e5e5e5;
    height: 60px;
    background: #FAFAFA;
    border-radius: 5px 5px 0 0;
}

.twostep_1,
.twostep_2 {
    border: 1px solid #d3d3d3;
    width: 760px;
    margin: 20px auto 0;
    padding-top: 20px;
    position: relative;
    height: 100px;
}

.twostep h4 {
    background: #fff;
    width: 80px;
    text-align: center;
    padding: 0 10px;
    color: #bbbbbb;
    position: absolute;
    font-size: 12px;
    height: 30px;
    line-height: 30px;
    top: -15px;
    left: 50px;
}
.twostep_1 p{line-height: 70px; width: 500px;}
.paientinfo {
    padding-bottom: 20px;
    border-bottom: 1px dashed #EFEFEF;
    width: 90%;
    margin: 20px auto;
}

.paientinfo table {
    width: 100%;
}

.paientinfo table td p span {
    display: inline-block;
    margin-left: 10px;
    height: 20px;
}

.paientinfo table td .iphone {
    background: url(../../assets/img/iphone.png) no-repeat left center;
    padding-left: 20px;
}

.paientinfo table td .other {
    font-size: 12px;
    color: #999;
}

.paientinfo table td .name {
    font-weight: 700;
}
.twostep_1 p span{
    padding-left: 30px;
 
    display: inline-block;
}

.twostep_1 p span.zhibiao {
    display: inline-block;
    background: url(../../assets/img/up_arrow.png) no-repeat right center;
    padding-right: 10px;
    width: 100px;
    
}
.twostep_1 p span.zhibiao2 {
    display: inline-block;
    background: url(../../assets/img/down_arrow.png) no-repeat right center;
    padding-right: 10px;
    width: 100px;
}
/*报告详情*/
.table th,.table td{
    text-align: center;
    vertical-align: middle;
}
#report-check .modal-dialog{
    width: 60%;
    position: absolute;
    top: 5%;
    left: 20%;
}
h4.report-detail-title{
    text-align: center;
}
div.tips{
    height: 30px;
    margin-bottom: 5px;
    border-bottom: 2px solid #ccc;
}
.tips span:first-child{
    float: left;
}
.tips span:last-child{
    float: right;
}
.account-msg span{
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
div.tit .table{
    margin-bottom: 0;
}
div.tit-list{
    height: 350px;
    overflow: auto;
}
span.prompt-flag{
    color: #f00;
}

.twostep_1 p span.zhibiao {
    display: inline-block;
    background: url(../../assets/img/up_arrow.png) no-repeat right center;
    padding-right: 10px;
    width: 100px;
}

.twostep_1 p span.zhibiao2 {
    display: inline-block;
    background: url(../../assets/img/down_arrow.png) no-repeat right center;
    padding-right: 10px;
    width: 100px;
}
</style>
